import ScrollView from "@/base_ui/scroll-view"
import SectionHeader from "@/components/section-header"
import SectionLongfor from "@/components/section-longfor"
import PropTypes from "prop-types"
import React, { memo } from "react"
import { LongforWrapper } from "./style"

const HomeLongfor = memo((props) => {
  const { dataInfo } = props
  return (
    <LongforWrapper>
      <SectionHeader title={dataInfo.title} subTitle={dataInfo.subtitle} />
      <div className="longfor-list">
        <ScrollView>
          {dataInfo.list.map((item) => {
            return <SectionLongfor itemData={item} key={item.city} />
          })}
        </ScrollView>
      </div>
    </LongforWrapper>
  )
})

HomeLongfor.propTypes = {
  dataInfo: PropTypes.object
}

export default HomeLongfor
